{template 'header'}
{template 'autoHeader','auto'}

<!--主体部分-->
<div class="layout960 fn-clear">
<!--左 start-->
<div class="auto-left fn-left">
<!--上 start-->
<div class="auto-ltop fn-clear">
	<!--图库，说明start-->
	<div class="auto-series-imgs fn-left">
	{if $carPicThumbs}
        <ul id="J_Big" class="big-img">
	        {loop $carPicThumbs $key $thumb}
            <li >
                <a href="{url('auto/pictureShow', 'carid='.$carId.'&pictureid='.$carPicThumbs[$key]['apid'])}" target="_blank">
                    <img src="{Picture::thumb($carPicThumbs[$key]['imgurl'], 350, 260)}">
                </a>
            </li>
	        {/loop}
        </ul>
		<ul id="J_Thumbnail" class="thumbnail fn-clear">
			{loop $carPicThumbs $thumb}
			<li><img src="{Picture::thumb($thumb['imgurl'],350,260)}"><i class="up-tri" style="display:none;"></i></li>
			{/loop}
		</ul>
	{else}
        <ul id="J_Big" class="big-img">
	        {loop $carPicThumbs $key $thumb}
            <li >
                <a href="{url('auto/pictureShow', 'carid='.$carId.'&pictureid='.$carPicThumbs[$key]['apid'])}">
                    <img src="{Picture::thumb($carPicThumbs[$key]['imgurl'], 350, 260)}">
                </a>
            </li>
			{/loop}
        </ul>
		<ul id="J_Thumbnail" class="thumbnail fn-clear">
			<li><img src="{Picture::thumb('',350,260)}"><i class="up-tri" style="display:none;"></i></li>
		</ul>
	{/if}

		<p>
			<a href="#chekuan">共{$carModelsNum}个车款</a>
			<a href="#tupian">共{$carPicNum}张图片</a>
		</p>
		<dl>
			<dt>官方报价：</dt>
			{if $carInfo[pricerange]}<dd class="price">{$carInfo[pricerange]}</dd>{else}<dd class="price">{$blank}</dd>{/if}
			<dt>品牌：</dt>
			{if $brandInfo['name']}<dd>{$brandInfo[name]}</dd>{else}<dd>{$blank}</dd>{/if}
			<dt>级别：</dt>
			{if $carInfo[levelrange]}<dd>{$carInfo[levelrange]}</dd>{else}<dd>{$blank}</dd>{/if}
			<dt>变速箱：</dt>
			{if $carInfo[gearboxrange]}<dd class="last">{$carInfo[gearboxrange]}</dd>{else}<dd class="last">{$blank}</dd>{/if}
		</dl>
	</div>
	<!--图库，说明end-->
	<!--最新文章 start-->
	<div class="auto-article fn-right">
		<div class="auto-hd">
			<h3>最新文章</h3>
		</div>
		<div class="article-list">
			{php $cfi = __($carInfomation)->first()}
			<h2><a href="{url('info/show', 'itemid='.$cfi['itemid'])}" target="_blank" title="{$cfi[title]}">{$cfi[title]}</a></h2>
			{php array_shift($carInfomation)}
			{php $cft = array_splice($carInfomation, 1, 9)}
			<ul class="ul-blue-dot bddot-bottom">
				{loop $cft $val}
				<li><a href="{url('info/show', 'itemid='.$val['itemid'])}" target="_blank" title="{$val['title']}">{$val['title']}</a></li>
				{/loop}
			</ul>
		</div>
	</div>
	<!--最新文章 end-->
    <!--最新行情 start-->
    <div class="auto-article fn-right">
        <div class="auto-hd">
            <h3>最新行情</h3>
            <a class="more" href="{url('quote/list')}" target="_blank">更多>></a>
        </div>
        <div class="article-list">
            {php $cfi = __($carQuote)->first()}
            <h2><a href="{url('quote/show', 'itemid='.$cfi['itemid'])}" target="_blank" title="{$cfi[title]}">{$cfi[title]}</a></h2>
            {php array_shift($carQuote)}
            {php $cft = array_splice($carQuote, 1, 9)}
            <ul class="ul-blue-dot">
                {loop $carQuote $val}
                <li><a href="{url('quote/show', 'itemid='.$val['itemid'])}" target="_blank"  title="{$val['title']}">{$val['title']}</a></li>
                {/loop}
            </ul>
        </div>
    </div>
    <!--最新行情 end-->
</div>
<!--上 end-->
<!--在售车款 start-->
<div class="series-onsale-style auto-bd" id="chekuan">
	<div class="auto-hd">
		<h3>{$carInfo['name']} - 在售车款</h3>
		<ul id="saleYear" class="auto-top-filter fn-left">
			{php $num = 0}
			{loop $modelsSale $saleType $yearGroup}
			<li class="nosale"><a href="javascript:void(0);"><span>{$saleType}</span><i class="triangle"></i></a>
				<ul class="js-nosale-option fn-hide">
					{loop $yearGroup $year $yearModels}
					<li><a href="javascript:void(0);">{if $year}{$year}{else}未知年款{/if}</a></li>
					{/loop}
				</ul>
			</li>
			{if ++$num != count($modelsSale)}<li class="line"></li>{/if}
			{/loop}
		</ul>
	</div>
	<!--在售车款列表 start-->
	<table id="saleYearContent" width="100%">
		{php $hasIssale=0}
		{php $hasUnsale=0}
		{loop $modelsSale $saleGroup}
		{loop $saleGroup $year $yearGroup}
		{php $count=0}
		{loop $yearGroup $model}
		{if $count ==0}
		{if $model[issale]}
		{php $hasIssale=1}
		{/if}
		{if !$model[issale]}
		{php $hasUnsale=1}
		{/if}
		<tbody id="sale-{$model[issale]}-{$model[year]}" {if !$model[issale]}class="fn-hide"{/if}>
		<tr>
			<th class="output" width="285px">{if $year}{$year}款{else}未知年款{/if}</th>
			<th width="130px">热度</th>
			<th width="155px">变速箱</th>
			<th width="110px">指导价</th>
			<th width="65px">&nbsp;</th>
		</tr>
		{/if}
		<tr>
			<td><a href="{url('auto/model', 'modelid='.$model['amid'])}" target="_blank" title="{$model[name]}">{$model[name]}</a></td>
			<td><span class="hot-level"><i style="width:54%;"></i></span></td>
			<td>{$model[cGearBox]}</td>
			<td class="price">{$model[cPrice]}</td>
			<td>
                <button class="js-compare-btn compare-btn-gray" data-modelType="{$model[modeltype]}" data-modelId="{$model[amid]}" data-fullName="{$car[name]} {$model[name]}">+对比</button>
            </td>
		</tr>
		{if ++$count ==count($yearGroup)}
		</tbody>
		{/if}
		{/loop}
		{/loop}
		{/loop}

		{if !$hasIssale}
		{if !$hasUnsale}
		<tbody id="sale-1-0" ><tr class="no-amid"><td>{$NoAmid}</td></tr></tbody>
		{else}
		<script>
			seajs.use(["$"], function($){
				$('#saleYearContent>tbody:eq(-1)').removeClass('fn-hide');
			})
		</script>
		{/if}
		{/if}

	</table>
	<!--在售车款列表 end-->
</div>
<!--在售车款 end-->
<!--图片 start-->
<div class="auto-gallery auto-bd mt10" id="tupian">
	<div class="auto-hd">
		<h3>{$carInfo['name']} - 图片</h3>
		<a class="more" href="{url('auto/pictureList', 'carid='.$carInfo['arid'])}" target="_blank">更多>></a>
	</div>
	<div class="content">
		{php $hasPic=0}
		{loop $carPicList $key $picType}
		{if $picType[pics]}
		{php $hasPic=1}
		<div class="auto-gallery-block bddot-bottom">
			<div class="gal-hd fn-clear">
				<h3>
					<a href="{url('auto/pictureList', 'carid='.$carid.'&t='.$picType['arid'])}">{$picType[name]}
						<span>（{$picType[num]}张）</span>
					</a>
				</h3>
				<a href="{url('auto/pictureList', 'carid='.$carid.'&t='.$picType['arid'])}" target="_blank" title="更多图片">更多图片>></a>
			</div>
			<ul class="fn-clear">
				{loop $picType[pics] $pic}
				<li>
					<a href="{url('auto/pictureShow', 'carid='.$carid.'&pictureid='.$pic['apid'])}" target="_blank" title="{$pic[title]}">
						<img src="{Picture::thumb($pic['imgurl'],150,113)}"/>
						{$pic[title]}
					</a>
				</li>
				{/loop}
			</ul>
		</div>
		{/if}
		{/loop}
		{if !$hasPic}
		<p>{$NoPic}</p>
		{/if}
	</div>
</div>
<!--图片 end-->
<!--视频 start-->
<div class="auto-series-video auto-bd mt10">
	<div class="auto-hd">
		<h3>{$carInfo['name']} - 视频</h3>
		<a class="more" href="{url('auto/videoList', 'carid='.$carInfo['arid'])}" target="_blank" title="更多">更多>></a>
	</div>
	<div class="video-list content">
        {if $carVideo}
		<ul class="fn-clear">
			{loop $carVideo $video}
			<li>
				<a href="{url('video/show', 'itemid='.$video['itemid'])}" target="_blank" title="{$video[title]}"><img src="{$video[thumb]}" width="150" height="113"></a>
                <a href="{url('video/show', 'itemid='.$video['itemid'])}" target="_blank" title="{$video[title]}">{$video[title]}</a>
			</li>
			{/loop}
		</ul>
        {else}
        <p>{$NoVideo}</p>
        {/if}
	</div>
</div>
<!--视频 end-->
</div>
<!--左 end-->
<!--右 start-->
<div class="auto-right fn-right">
	<!--其他车系 start-->
	{template 'part_CarRelation', 'auto'}
	<!--其他车系 end-->
	<!--网友还看过 start-->
	{template 'part_CarAttention', 'auto'}
	<!--网友还看过 end-->
	<!--品牌在售车系 start-->
	{template 'part_CarOnsale', 'auto'}
	<!--品牌在售车系 end-->
</div>
<!--右 end-->
</div>
<script type="text/javascript">
    seajs.use(['$','lm-util'],function($,util){
        util.showThumbnail("#J_Big","#J_Thumbnail");

        //在售/停售车款筛选
        $(".nosale").each(function(index, element) {
            $(this).hover(function() {
                $(this).addClass("over");
                $(this).children(".js-nosale-option").removeClass("fn-hide");
            }, function() {
                $(this).removeClass("over");
                $(this).children(".js-nosale-option").addClass("fn-hide");
            });
        });

        var $noSale = $("ul#saleYear").find("ul").eq(0).find("li"),
                $onSale = $("ul#saleYear").find("ul").eq(1).find("li"),
                noSaleNum = $noSale.length,
                $saleYearCon = $("table#saleYearContent").find("tbody");

        $noSale.each(function(index){
            $(this).click(function(){
                console.log(index)
                $saleYearCon.eq(index).removeClass("fn-hide").siblings().addClass("fn-hide");
                $(this).parent("ul").addClass("fn-hide");
            });
        });
        $onSale.each(function(index){
            $(this).click(function(){
                $saleYearCon.eq(index+noSaleNum).removeClass("fn-hide").siblings().addClass("fn-hide");
                $(this).parent("ul").addClass("fn-hide");
            });
        });
    });
</script>
<!--主体部分 end-->
{template 'auto-compare', 'fragment'}
{template 'footer'}
<!--主体部分 end-->
